<template>
    <div>
        <div class="head-wapper">
            <div class="wapper-desc">
                <div class="desc-title">
                    <span>家护帮</span>累计服务家庭超万家</div>
                <div class="desc-wapper">
                    <img class="desc-img" src="../../../assets/4.png" alt="" srcset="">
                    <div class="desc-fuwu">
                        <div class="fuwu-text">
                            <div>共服务家庭：
                                <span style="color: #ff8022">19‘041</span> 家 </div>
                            <div>正在服务：
                                <span style="color: #ff8022">5’645</span> 家</div>
                            <div>已服务完成：
                                <span style="color: #44a91e">13940</span> 家</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
export default {

}
</script>

<style lang="stylus" scoped>
    .head-wapper
       margin-top: 67px;
       height: 800px;
       background-image: url("");
       background-size: cover;
       position: relative;
       .wapper-desc
            position: absolute;
            top: 158px;
            right: 441px;
            width: 764px;
            height: 350px;
            background-color: rgba(255, 255, 255, .6);
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            .desc-title
                font-size: 55px;
                color: #3a3a39;
                line-height: 100px;
                letter-spacing: 3px;
                margin-bottom: 35px;
                > span 
                    color: #5287ff;
            .desc-wapper
                width: 699px;
                height: 68px;
                background-color: #bdc7fd;
                border-radius: 11px;
                display: flex;
                align-items: center;
                justify-content: center;
                position: relative;
                .desc-fuwu
                    width: 641px;
                    height: 52px;
                    display: flex;
                    align-items: center;
                    background-color: #fff; 
                    .fuwu-text
                        font-size: 15px;
                        color: #141517;
                        display: flex;
                        margin-left: 40px;
                        > div 
                            margin-left: 30px;
                 .desc-img
                    position: absolute;
                    width: 60px;
                    height: 60px;
                    top: 0;
                    left: 0;      
</style>

